<template>
  <div class="App">
    <!-- 头部组件 -->
    <MyHeader></MyHeader>
    <!-- 主体组件 -->
    <MyMain></MyMain>
    <!-- 底部组件 -->
    <MyFooter></MyFooter>
  </div>
</template>

<script>
import MyFooter from './components/MyFooter.vue';
import MyHeader from './components/MyHeader.vue';
import MyMain from './components/MyMain.vue';
export default {
components:{
    MyHeader:MyHeader,
    MyMain:MyMain,
    MyFooter:MyFooter
}
}
</script>

<style>
.App{
    width: 400px;
    height: 600px;
    background-color: skyblue;
    margin: 0 auto;
    padding: 20px;
}
</style>